<template>
	<div id="about">
		<!-- pc端 -->
			<!-- <div style="min-width:1400px" class="mainPage_pc_main_194P4">
        <div class="about">
          <div   class="import-info">
            <img  width="100%" height="130px" src="../assets/image/shop_detail.png">
            <div  class="btn"></div>
            <div></div>

            <div  class="main-content">
              <div  class="about-item">
                <div  class="about-item-content">
                  <h3  class="item-title"> About us </h3>
                  <p > Mottwebsite is a bridge shopping platform. We seek around and find the promising brands and 
                    products, showcase them on Mottwebsite.com and find them product testers. Our users can try their favorite products 
                    at zero cost by purchasing, reviewing and getting refund. </p>
                  <p > Mottwebsite's commission is to help people find good stuff, save money and in return delivering 
                    fair and comprehensive trial reports to the sellers. We don't charge fees, you can't beat that! </p>
                </div>
                <p  class="companyTxt" style="margin-top: 20px;"> Company Name: Chongshan Zhonghui Health Technology (Tianjin) 
                  Co., Ltd. </p>
                <p  class="companyTxt"> Nanzhaozhuang Village, Daliang Town, Wuqing District, Tianjin</p>
                <p  class="companyTxt"> Commercial Building, Tairan 9th Road, Tianan </p>
                <p  class="companyTxt"> Community, Shatou Street, Futian District, Shenzhen. </p>
                <div  class="about-item-content">
                  <h3  class="item-title"> How Does Mottwebsite Work? </h3>
                  <p > Simple. Because Mottwebsite is running a program that is supported by both 
                    the brands and the buyers. </p>
                  <p > Everyday many and many of new products are launched on Amazon and they are 
                    working extremely hard to gain the early users. With this program, their products get exposed to the users, 
                    the Mottwebsite members, who will give them valuable feedback on the products. Therefore, Brand Companies find the 
                    future development of new products. In return, they reward the users with up to . </p>
                 </div>
                 </div>
                 <div  class="about-content">
                   <div  class="about-content-item"><img style="width:215px"  src="../assets/images/about_icon_01.png" alt="" class="fisrt">
                   <p  class="about-title"> Sellers Share Deals </p>
                   <p  class="about-desc"> Get access to limited new product for a <br >
                    huge selection of products, most 100% off. </p>
                    </div>
                    <img  src="" alt="" class="next">
                    <div  class="about-content-item">
                      <img  src="../assets/images/about_icon_02.png" alt="" class="second">
                      <p  class="about-title"> Community Publish </p>
                      <p  class="about-desc"> Our editors publish the best products <br > we receive from the most respected sellers. </p>
                    </div>
                    <img  src="" alt="" class="next">
                    <div  class="about-content-item">
                      <img  src="../assets/images/about_icon_03.png" alt="" class="second">
                      <p  class="about-title"> Shoppers Get Rebates </p>
                      <p  class="about-desc"> Shoppers get the 100% up to moneyback <br > on the web for any product they apply <br > for trial. </p>
                      </div>
                      </div>
                      <div  class="about-more">
                        <div  class="more-content">
                          <h2 >More Reasons to Use Mottwebsite</h2>
                          <p >If you're looking for great discounts:</p>
                          <ul >
                            <li >
                              <div >
                                </div>Save money unlike any other website out there and cut down on expenses by buying products even for !
                            </li>
                            <li >
                              <div >
                              </div>Save time by shopping online through Mottwebsite, guaranteeing you premium products.
                            </li>
                            <li >
                              <div ></div>
                              Be the first one to try out the new products.Get products quickly with 2-day shipping using your Amazon Prime account.
                            </li>
                            <li >
                              <div ></div>Find thousands upon thousands of items in home, clothing, beauty, electronics, tech, kids, books, pets and more.</li>
                              </ul>
                              </div>
                              <div  class="more-content">
                                <h2  class="more-second">Questions</h2>
                                <p  class="second-p"> Visit our <span @click="btnChaneg('/fag')" >FAQs </span>
                                or contact <a  href="info@mottconsulting.co.jp" class="theme-color">Customer Service</a>
                                , <br > we're happy to answer any questions! 
                                </p>
                                </div>
                                </div>
                                </div>
          </div>
        </div>
      </div> -->
			<div v-html="this.$t('about.about')"></div>
		

		<!-- 移动端 -->
		
			<!-- <div class="iphone_main-content">
          <div data-v-508af9a6="" class="about-item">
              <div data-v-508af9a6="" class="about-item-content">
                <h3 data-v-508af9a6="" class="item-title"> About us </h3>
                <p data-v-508af9a6=""> Mottwebsite is a bridge shopping platform. We seek around and find the promising brands and products,
                  showcase them on Mottwebsite.com and find them product testers. Our users can try their favorite products at zero cost by 
                  purchasing, reviewing and getting refund. 
                </p>
                <p data-v-508af9a6=""> Mottwebsite's commission is to help people find good stuff, save money and in return delivering fair and 
                  comprehensive trial reports to the sellers. We don't charge fees, you can't beat that! 
                </p>
              </div>
              <div data-v-508af9a6="" class="about-item-content">
                <h3 data-v-508af9a6="" class="item-title"> How Does Mottwebsite Work? </h3>
                <p data-v-508af9a6=""> Simple. Because Mottwebsite is running a program that is supported by both the brands and the buyers. </p>
                <p data-v-508af9a6=""> Everyday many and many of new products are launched on Amazon and they are working extremely hard to gain the 
                  early users. With this program, their products get exposed to the users, the Mottwebsite members, who will give them valuable feedback 
                  on the products. Therefore, Brand Companies find the future development of new products. In return, they reward the users with up to . </p>
              </div>
          </div>

          <div data-v-508af9a6="" class="about-content">
            <div data-v-508af9a6="" class="about-content-item">
              <img data-v-508af9a6="" width="120px" height="84px" src="../assets/images/about_icon_01.png" alt="" class="fisrt" style="margin-left: 22vh;">
              <p data-v-508af9a6="" class="about-title"> Sellers Share Deals </p>
              <p data-v-508af9a6="" class="about-desc"> Get access to limited new product for a 
                <br data-v-508af9a6=""> huge selection of products, most 100% off. </p>
              </div>
              <img data-v-508af9a6="" src="" alt="" class="next">
              <div data-v-508af9a6="" class="about-content-item">
                <img data-v-508af9a6="" width="92px" height="102px" src="../assets/images/about_icon_02.png" alt="" class="second">
                <p data-v-508af9a6="" class="about-title"> Community Publish </p>
                <p data-v-508af9a6="" class="about-desc"> Our editors publish the best products <br data-v-508af9a6=""> 
                we receive from the most respected sellers. </p>
                </div>
                <img data-v-508af9a6="" src="" alt="" class="next">
                <div data-v-508af9a6="" class="about-content-item">
                  <img data-v-508af9a6="" width="114px" height="94px" src="../assets/images/about_icon_03.png" alt="">
                  <p data-v-508af9a6="" class="about-title"> Shoppers Get Rebates </p>
                  <p data-v-508af9a6="" class="about-desc"> Shoppers get the 100% up to moneyback
                     <br data-v-508af9a6=""> on the web for any product they apply <br data-v-508af9a6=""> for trial. </p>
                  </div>
                </div>

                <div data-v-508af9a6="" class="about-more">
                  <div data-v-508af9a6="" class="more-content">
                    <h2 data-v-508af9a6="">More Reasons to Use Mottwebsite</h2>
                    <p data-v-508af9a6="">If you're looking for great discounts:</p>
                    <ul data-v-508af9a6="">
                      <li data-v-508af9a6="">
                        <div data-v-508af9a6="">
                          </div>Save money unlike any other website out there and cut down on expenses by buying products even for !</li>
                          <li data-v-508af9a6="">
                            <div data-v-508af9a6=""></div>
                            Save time by shopping online through Mottwebsite, guaranteeing you premium products.</li>
                            <li data-v-508af9a6=""><div data-v-508af9a6=""></div>
                            Be the first one to try out the new products.Get products quickly with 2-day shipping using your Amazon Prime account.</li>
                            <li data-v-508af9a6=""><div data-v-508af9a6=""></div>Find thousands upon thousands of items in home, clothing, beauty, electronics,
                             tech, kids, books, pets and more.
                             </li>
                      </ul>
                      </div>
                      <div data-v-508af9a6="" class="more-content">
                        <h2 data-v-508af9a6="" class="more-second">Questions</h2>
                        <p data-v-508af9a6="" class="second-p"> Visit our <span @click="btnChaneg('/fag')" data-v-508af9a6="">FAQs </span>
                        or contact <a data-v-508af9a6="" href="info@mottconsulting.co.jp" class="theme-color">Customer Service</a>, 
                        <br data-v-508af9a6=""> we're happy to answer any questions! </p>
                    </div>
                  </div>
        </div> -->
			<div v-html="this.$t('about.about2')"></div>
		<my-footer style="background:#f5f5f5"></my-footer>
	</div>
</template>

<script>
	import myFooter from '../components/my-footer/my-footer.vue'
	export default {
		components: {
			myFooter
		},
		name: "about",
		methods: {
			btnChaneg(path) {
				this.$router.push(path)
			}
		}
	}
</script>

<style lang='scss' >
	@media only screen and (max-width: 900px) {
		.user_about_pc {
			display: none;
			overflow: hidden;
		}
	}

	@media only screen and (min-width: 900px) {
		.user_about_iphone {
			display: none;
		}

		html {
			font-size: 30px;
		}
	}

	#about{
		.main-content {
		/* padding: 0 70px; */
		padding: 0 70px;

		.about-item {
			padding: 1rem 1.05rem 0;
			text-align: left;

			.item-title {
				font-size: 30px;
				color: #020000;
				font-weight: 400;
				margin-bottom: .5rem;
			}
		}

		.about-item p {
			line-height: 30px;
			color: #595757;
		}

		.about-content {
			margin-top: 60px;
			display: flex;

			.about-content-item {
				text-align: center;
				margin-top: 3rem;
				margin: 0 22px;

				.fisrt {
					width: 215px;
					margin-bottom: 30px;

					.about-title {
						line-height: 1.4rem;
						font-size: 30px;
						color: #020000;
						text-align: left;
						margin-bottom: 20px;
					}

					.about-desc {
						line-height: 30px;
						color: #595757;
						text-align: left;
					}
				}
			}
		}

		.about-content img {
			display: block;
			max-width: 100%;
			margin: 0 auto;
		}

		.about-title {
			line-height: 1.4rem;
			font-size: 30px;
			color: #020000;
			text-align: left;
			margin-bottom: 20px;
		}

		.about-desc {
			line-height: 30px;
			color: #595757;
			text-align: left;

		}

		.next {
			display: block;
			width: 3rem;
			height: 2.85rem;
			margin: .8rem auto;
			margin-top: 8rem;
			transform: rotate(-90deg);
			position: relative;
			top: 6rem;
		}

		img {
			border: 0 none;
		}

		.second {
			height: 148px;
			margin-bottom: 30px;
			margin-top: 3rem;
			display: block;
			max-width: 100%;
			margin: 0 auto;
			margin-bottom: 30px !important;
		}

		.fisrt {
			width: 215px !important;
			margin-bottom: 30px;
		}

		/* .about-content-item:first-child {
    margin-top: 3rem;
  } */
		.about-more {
			padding: 0 1rem;
		}

		.more-content h2 {
			padding-top: 1rem;
			padding-bottom: .5rem;
			font-size: 30px;
			color: #020000;
			font-weight: 400;
			text-align: left;
		}

		.more-content p {
			border-top: .05rem solid #dcdddd;
			line-height: 30px;
			color: #595757;
			text-align: left;
		}

		.more-content ul li {
			line-height: 30px;
			text-align: left;
			color: #ff5900;

		}

		.more-content ul li div {
			float: left;
			padding: .14rem;
			background: #ff5900;
			border: .01rem solid #ff5900;
			border-radius: 50%;
			margin: .4rem .3rem 0 .4rem;
			margin-left: .4rem;
			margin-right: .6rem;
			margin-top: .6rem;
		}

		.more-content p span {
			color: #ff5900;
		}

		.theme-color {
			color: #ff5900;
		}
	}
	}


	/* 移动端 */
	#about{
		
		.iphone_main-content {
		padding-top: .5rem;
		background-color: #f5f5f5;
		padding-bottom: .7rem;
		text-align: left;

		.about-item {
			padding: 1rem 1.05rem 0;
		}

		.about-item-content {
			.item-title {
				font-size: .875rem;
				color: #020000;
				font-weight: 400;
				margin-bottom: .5rem
			}
		}

		.about-item-content p {
			font-size: .7rem;
			line-height: 1rem;
			color: #595757;
		}

		.about-item-content {
			margin-top: 1rem;
		}

		.about-content {
			.about-content-item {
				margin-top: 3rem;
			}
		}

		.about-content img {
			display: block;
			max-width: 100%;
			margin: 0 auto;
		}

		.about-content {
			line-height: 1.4rem;
			font-size: .875rem;
			color: #020000;
			text-align: center;
		}

		.about-title {
			line-height: 1.4rem;
			font-size: .875rem;
			color: #020000;
			text-align: center;
		}

		.about-more {
			padding: 0 1rem;
		}

		.more-content h2 {
			padding-top: 1rem;
			padding-bottom: .5rem;
			font-size: .875rem;
			color: #020000;
			font-weight: 400;
		}

		.more-content p {
			border-top: .05rem solid #dcdddd;
			line-height: 1.4rem;
			font-size: .7rem;
			color: #595757;
		}

		.more-content ul {
			list-style-type: none;
			padding: 0;
			margin-bottom: 1rem;
			font-size: .7rem;
			color: #ff5900;
		}

		.more-content ul li {
			line-height: 1rem;
		}

		.more-content ul li div {
			float: left;
			padding: .14rem;
			background: #ff5900;
			border: .01rem solid #ff5900;
			border-radius: 50%;
			margin: .4rem .3rem 0 .4rem;
			margin-left: .4rem;
			margin-right: .3rem;
			margin-top: .4rem;
		}

		.more-content h2 {
			padding-top: 1rem;
			padding-bottom: .5rem;
			font-size: .875rem;
			color: #020000;
			font-weight: 400;
		}

		.more-content p span {
			color: #ff5900;
		}

		.theme-color {
			color: #ff5900;
		}
	}
	}
	#about .main-content .more-content p span a{
    color: #ff5900;
}
#about .iphone_main-content .more-content p span a{
    color: #ff5900;
}
</style>
